<template>
  <div class="mr-10px px-5px py-2px box-border border-2 rounded text-red-600 cursor-pointer"
       @click="dialogActive = true">退出团队
  </div>
  <dialog-view title="退出团队" v-model:active="dialogActive" :height="200" @submit="onSubmit">
    <div class="h-full center~ text-sm">
      <div v-if="userId === leaderId">你为当前团队群主，若退出，将会解散团队，是否解散当前团队？</div>
      <div v-else>是否退出当前团队？</div>
    </div>
  </dialog-view>
</template>

<script setup lang="ts">
import {ref} from "vue";
import DialogView from "@/components/viewComponents/DialogView.vue";
import router from "@/router";

interface Props {
  userId: number
  leaderId: number
  groupId: number
}

const rawProps = defineProps<Props>()
const {userId, leaderId, groupId} = toRefs(rawProps)
const dialogActive = ref(false)

function onSubmit() {
  if (leaderId.value == userId.value) {
    dismissGroup(leaderId.value, groupId.value, () => {
      router.push("/groupExhibition")
    }, (message) => {
      console.log(message)
    })
  }
}
</script>

<style scoped>

</style>